<template>
  <el-dialog
    title="分配角色权限"
    :visible.sync="dialogVisible"
    width="40%"
    :before-close="Offf"
    @open="gethttp"
    >
        <el-tree 
        :data="list" 
        :props="defaultProps"
         default-expand-all 
         node-key="id"
         :default-checked-keys="defkeys"
         show-checkbox></el-tree>
        <span slot="footer" class="dfialog-footer">
            <el-button @click="Offf">取 消</el-button>
            <el-button type="primary" @click="Offf">确 定</el-button>
        </span>
</el-dialog>
</template>

<script>
export default {
name:'rolePrivileges',
data() {
    return {
        //树状列表总数据
        list: [],
        // 树形控件属性绑定对象
        defaultProps: {
          children: 'children',
          label: 'authName'
        },
        // 存储三级列表的id
        defkeys:[]
    };
},
methods: {
    // 关闭模态框
    Offf(){
        this.offf()
    },
    // 通过递归形式获取角色下所有的三级权限id，并保存在数组defkeys数组中
    getLeafkeys(node,arr){
        if(!node.children){return arr.push(node.id)}
        node.children.forEach(item => {
            this.getLeafkeys(item,arr)
        });
    },
    //发送请求获取列表数据
    gethttp(){
        this.$http.get('rights/tree').then(
        respose => {//正确请求时执行的代码
            // console.log(respose.data);
            if(respose.data.meta.status!=200){
                console.log("获取失败");
            }else{
                // console.log("获取成功");
                this.list = respose.data.data
                // 打开时默认勾选的三级菜单
                this.getLeafkeys(this.rolePrivileges,this.defkeys)
            }
            
        },error => {},)
    }
},
props:['dialogVisible','offf','rolePrivileges']
}
</script>

<style>

</style>